Ext.define('Intranet.VeCongTy.view.MainView', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.VeCongTy_MainView',
    layout: {
        type: 'hbox',
        align: 'stretch',
        padding: 10
    },
    items: [{
            xtype: 'panel',
            id: 'VeCongTy_MainView_Column1',
            margins: '0 0 7 0',
            flex: 2,
            border: false,
            layout: {
                type: 'vbox',
                align: 'stretchmax'
            },
            defaults: {
                floating: true,
                style: 'margin-right: 0; margin-bottom: 15px'

            },
            items: []
        }, {
            xtype: 'panel',
            margins: '0 0 7 0',
            flex: 8,
            layout: 'card',
            activeItem: 0,
            id: 'VeCongTy_MainView_Column2',
            items: []
        }],
    initComponent: function()
    {
        this.callParent(arguments);

        var thisComponent = this;

        var colunm1 = thisComponent.items.get(0);
        var column2 = thisComponent.items.get(1);

        var panel = Ext.widget('panel', {
            html: 'So do',
            itemId: 'VeCongTy_so_do'
        });
        column2.add(panel);

        var button = Ext.widget('button', {
            text: 'So do',
            id: 'VeCongTy_so_do_Btn',
            height: 50,
            minWidth: 100,
            handler: function() {
                column2.getLayout().setActiveItem(this.getId().replace('_Btn', ''));
            }
        });
        colunm1.add(button);

        Ext.Ajax.request({
            url: '/src/public/ve-cong-ty/tab/index',
            headers: {
                'Accept': 'application/json',
                'charset': 'utf-8'
            },
            success: function(response, opts) {
                var data = Ext.decode(response.responseText);

                if (data.success === 'true')
                {
                    var tabs = data.tabs;

                    for (var i = 0; i < tabs.length; i++)
                    {
                        var panel = Ext.widget('panel', {
                            html: tabs[i].value,
                            itemId: 'VeCongTy_' + tabs[i].key_name
                        });

                        column2.add(panel);

                        var button = Ext.widget('button', {
                            text: tabs[i].name,
                            id: 'VeCongTy_' + tabs[i].key_name + '_Btn',
                            height: 50,
                            minWidth: 100,
                            handler: function() {
                                column2.getLayout().setActiveItem(this.getId().replace('_Btn', ''));
                            }
                        });

                        colunm1.add(button);
                    }
                }
            }
        });
    }
});
